<template>
	<!-- 交货单出库    -->
	 
	<view class="">
		<view class="card-wrapper">
			<view class="radius shadow shadow-lg bg-white padding-sm light bg-blue">
				<view class="flex flex-wrap">
					<view class="basis-xs">
						单据编号:
					</view>
					<view class="basis-xl text-black">
						{{ mainOrder.BILLNO }}
					</view>
				</view>

				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						集团:
					</view>
					<view class="basis-xl text-black">
						{{ mainOrder.GROUPNAME || '' }}
					</view>
				</view>
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						组织:
					</view>
					<view class="basis-xl text-black">
						{{ mainOrder.ORGNAME || '' }}
					</view>
				</view>
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						部门:
					</view>
					<view class="basis-xl text-black">
						{{ mainOrder.DEPTNAME || '' }}
					</view>
				</view>
				
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						供应商:
					</view>
					<view class="basis-xl text-black">
						{{ mainOrder.BILLMAKER || '' }}
					</view>
				</view>
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						申请人:
					</view>
					<view class="basis-xl text-black">
						{{ mainOrder.APPLYER || '' }}
					</view>
				</view>
				
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						仓库<span class="text-red">*</span>
					</view>
					<view class="basis-xl text-black position-r solid-bottom" :class="isActiveStore? 'solid-bottom-blue' :'' ">
						<input class="wc-input" style="width: 60%;" 
						name="STORENAME" type="text"  
						@tap="seachEvent('BD_STORE','1')"
						:value="mainOrder.STORENAME" 
						disabled
						placeholder="请选择或扫码" />
						<view class="basis-xs text-right position-a scan-btn " @tap="openScan('msid')">
							<text class="cuIcon-scan text-xxl text-bold"></text>
						</view>
					</view>
				</view>
				
				<view class="flex flex-wrap margin-top ">
					<view class="basis-xs">
						备注:
					</view>
					<view class="basis-xl text-black solid-bottom" :class="isActiveNote? 'solid-bottom-blue' :'' ">
						<input  class="wc-input" type="text" v-model="mainOrder.VMEMO" placeholder="请输入备注"/>
					</view>
				</view>
			</view>
			<!-- 物资子表 -->
			
			<view class="radius shadow shadow-lg bg-white padding-sm margin-top sub-table" v-for="(item,index) in planList" :key="index">
				<view class="flex flex-wrap">
					<view class="basis-xs">
						物资单号
					</view>
					<view class="basis-xl text-black">
						{{ item[mid] }}
					</view>
				</view>
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						物资名称
					</view>
					<view class="basis-xl text-black" v-if="bstype!='M9001' ">
						{{ item.MATERIALNAME }} &emsp;|&emsp; {{ item.WNUM || ''}} 
					</view>
					<view class="basis-xl text-black" v-if="bstype=='M9001' ">
						{{ item.MATERIALNAME }} &emsp;|&emsp; {{ item.WAITNUM || '' }} {{ item.UNITNAME|| '' }}
					</view>
				</view>
				
				<view class="flex flex-wrap margin-top line-height-30 ">
					<view class="basis-xs ">
						申请数量
					</view>
					<view class="basis-xl solid-bottom  sub-table-input" >
						<input class="wc-input" v-model="item.NNUM" type="text" placeholder="请输入到货量"/>
					</view>
				</view>
				
				<!-- <view class="flex flex-wrap margin-top " >
					<view class="basis-xs ">
						仓库<span class="text-red">*</span>
					</view>
					<view class="basis-xl text-black position-r solid-bottom" :class="isActiveStore? 'solid-bottom-blue' :'' ">
						<input class="wc-input" disabled style="width: 60%;" 
						name="STORENAME" type="text"  
						@tap="seachEvent('BD_STORE','0',index)"
						placeholder="请选择或扫码"
						:value="item.STORENAME" />
						<view class="basis-xs text-right position-a scan-btn " @tap="openScan('STORE',index)">
							<text class="cuIcon-scan text-xxl text-bold"></text>
						</view>
					</view>
				</view> -->
				
				<view class="flex flex-wrap margin-top ">
					<view class="basis-xs">
						货位 <span class="text-red">*</span>
					</view>
					<view class="basis-xl text-black position-r solid-bottom" :class="isActiveStore? 'solid-bottom-blue' :'' ">
						<input class="wc-input" disabled style="width: 60%;" 
						name="STATIONNAME" type="text"
						@tap="seachEvent('BD_RACK','0',index,mainOrder.STORENAME)"
						placeholder="请选择或扫码"
						:value="item.STATIONNAME" />
						<view class="basis-xs text-right position-a scan-btn " @tap="openScan('STATION',index)">
							<text class="cuIcon-scan text-xxl text-bold"></text>
						</view>
					</view>
				</view>
				
				<view class="flex flex-wrap margin-top ">
					<view class="basis-xs">
						生产日期
					</view>
					<view class="basis-xl text-black solid-bottom" @click="dateEvent('FACTORYDATE',index)">
						{{ item.FACTORYDATE }} 
					</view>
				</view>
				
				<view class="flex flex-wrap margin-top ">
					<view class="basis-xs">
						保质期
					</view>
					<view class="basis-xl text-black solid-bottom">
						<!-- {{ item.EXPDATE }} -->
						<input class="wc-input" v-model="item.EXPDATE" type="text" value="item.EXPDATE" placeholder="请输入到货量"/>
					</view>
				</view>
				
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						入库日期
					</view>
					<view class="basis-xl text-black" @click="dateEvent('INSTOCKDATE',index)">
						{{  item.INSTOCKDATE }}
					</view>
				</view>
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						图片上传
					</view>
					<view class="basis-xl text-black solid-bottom">
						{{ item.INPHOTO }} 
					</view>
				</view>
			</view>
			
			
			<view class="">
				<button class="cu-btn block bg-blue margin-tb-sm lg" @click="submit">
					<!-- <text class="cuIcon-loading2 cuIconfont-spin"></text> --> 
					提交
				</button>
			</view>
		</view>
		
		<w-picker
			mode="dateTime" 
			startYear="2000" 
			endYear="2050"
			step="1"
			:defaultVal="[1,1,1,1,2,5]" 
			:current="true" 
			@confirm="onConfirm" 
			ref="dateTime" 
			themeColor="#f00"
		></w-picker>
		
	</view>	
	
</template>
<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	import wPicker from "@/components/w-picker/w-picker.vue";
	import api from '@/common/api.js';
	import utils from '@/common/util.js';
	let query = {
			"category":"ST_INAPPLY",
			"page":1,
			"rows":"50",
			"sidx":"",
			"sord":"",
			"queryJson":{},
			"userId":"",
			"account":"admin"
	}
	let _self, dateTimekey, activeIndex, VMEMO,BILLFROM ,ajaxUrl,activeType; 
	export default{
		computed: mapState(['userInfo']),
		data(){
			return{
				bstype:'',
				mainOrder:{ VMEMO:'' },
				planList: [],
				isActiveNote:false,
				isActiveStore:false,
				mid:'',
				today:utils.getToDay(),
				dateTimekey:'',
				// activeIndex:'',
				label01: '单号' // 主表的第一个label
			}
		},
		components: {
			wPicker
		},
		onLoad(p) {
			 // console.log(p);
			_self = this 
			this.bstype = p.t
			query.userId = _self.userInfo.UserId
			query.account = _self.userInfo.Account
			query.category = p.dbt;
			if(p.dbt=='ST_INAPPLY'){
				BILLFROM = 1
			}else if(p.dbt=='PP_SUPLIST'){
				BILLFROM = 2
			}else if(p.dbt=='PP_PURORDERS'){
				BILLFROM = 3
				query.category = 'PP_PURORDERS_DTL';
			}
			let abc = JSON.parse(decodeURIComponent(p.item));
			abc.PK_STORE = '' ;
			abc.STORENAME = '' ;
			_self.mainOrder = abc
			// ajaxUrl =p.dbt=='ST_OUTAPPLY'?api.apiPublic.SaveOutApply :  api.apiPublic.saveInStore ;
			ajaxUrl = api.apiPublic.dInboundSubmit 
			// console.log(p.dbt);
			let queryJsonID ='PK_'+ query.category.split('_')[1];
			query.queryJson[queryJsonID] = p.id
			_self.mid = queryJsonID + '_DTL' ;
			_self.getDetail();
		},
		
		onShow() {
			uni.$on('getSelectItem',function(data){
				// console.log(data);
				// console.log(activeType);
				switch (activeType){
					case 'MSTORE': // 主表仓库
						_self.mainOrder.PK_STORE = data.BILLNO
						_self.mainOrder.STORENAME = data.VNAME
						break;
					case 'GROUP':
						_self.mainOrder.GROUPNAME = data.FullName
						_self.mainOrder.PK_GROUP = data.OrganizeId
						break;
					case 'BA_ORGANIZE':
						_self.mainOrder.ORGNAME = data.FullName
						_self.mainOrder.PK_ORG = data.OrganizeId
						break;
					case 'BA_DEPARTMENT':
						_self.mainOrder.DEPTNAME = data.FullName
						_self.mainOrder.PK_DEPT = data.OrganizeId
						break;
						
					
					case 'BA_USER':
						_self.mainOrder.APPLYER = data.RealName
						_self.mainOrder.PK_APPLYER = data.UserId
						break;	
					
						
					case 'BD_STORE': // 仓库子
						_self.planList[activeIndex].PK_STORE = data.BILLNO
						_self.planList[activeIndex].STORENAME = data.VNAME
						break;
					case 'BD_RACK': // 货位子
						_self.planList[activeIndex].STATIONNAME = data.VNAME
						_self.planList[activeIndex].PK_STATION = data.BILLNO
						break;
					default:
						break;
				}
			})	
		},
		
		methods:{
			seachEvent(t,isMainTB,i,store){
				// console.log(t,isMainTB,i,store);
				activeType = isMainTB==1?'MSTORE': t  ;
				activeIndex = i // 激活的子表下标
				if (t == 'BD_RACK' && !store) return utils.tips('请先选择仓库');
				uni.navigateTo({
					url:'/pages/public/search?t='+t
				})
			},
			onConfirm(val){
				this.planList[activeIndex][dateTimekey] = val.result ;
			},
			dateEvent(id,index){
				dateTimekey = id ;
				activeIndex = index ;
				this.$refs.dateTime.show();
			},
			openScan(id,index){
				// _isActiveStore = true ;
				// console.log(id,index)
				uni.scanCode({
						onlyFromCamera: true,
						success: function (res) {
								// console.log(res)
								if(res.scanType != 'QR_CODE'){
									return uni.showToast({
										icon:'none',
										title:'类型错误，请重新扫描' 
									})
								}
								let t = res.result.replace(/'/g,'"');
								let data = JSON.parse('{'+t+'}') ;
								let sid = 'PK_'+ id,sname = id+'NAME';
								console.log(sid);
								console.log(sname);
								if(id == 'msid'){
									_self.mainOrder.PK_STORE = data.PK_STORE ;
									_self.mainOrder.STORENAME = data.STORENAME ;
								}else if(id == 'STORE'){
									_self.planList[index][sname] = data.STORENAME
									_self.planList[index][sid] = data.PK_STORE
								}else if(id == 'STATION'){
									_self.planList[index][sname] = data.STATIONNAME
									_self.planList[index][sid] = data.PK_STATION
								}
						}
				});
				
			},
			getDetail(){
				let URL = api.apiPublic.dInboundDelivery;
				console.log(URL);
				this.axios({
					url: URL ,
					data: query ,
					isLoading: 1
				}).then(res=>{
					let { Result } = res ;
					let array = Result.rows.map((item)=>{
						item.FACTORYDATE = '';
						item.EXPDATE = '180';
						item.INSTOCKDATE = utils.getToDay();
						item.STORENAME = '';
						item.PK_STORE = '';
						item.STATIONNAME = '';
						item.PK_STATION = '';
						item.INPHOTO = '';
						item.NNUM = item.WNUM;
						// item.RACKNAME = ''
						// item.PK_RACK = ''
						return item;
					})
					_self.planList = array
				})
			},
			submit(){
				let data = { 
					"FRBILLNO": _self.mainOrder.BILLNO ,
					"BILLFROM": 4 ,
					"PK_SUPPLY": _self.mainOrder.PK_SUPPLY , // 供应商编号
					"PK_STORE": _self.mainOrder.PK_STORE, //CKGL20190802000001
					"STORENAME": _self.mainOrder.STORENAME, // 测试仓库
					"VMEMO": VMEMO,
					"BTYPE": 3,
					"userId": _self.userInfo.UserId ,
					"account": _self.userInfo.Account,
					"Detail": JSON.stringify(_self.planList)
				}
				console.log(data)
				let checkResult = false,error='';
				_self.planList.forEach((item)=>{
					if(!item.PK_STATION){
						 return error = '货位不能为空'
					}
					checkResult = true;
				})
				
				if(!data.PK_STORE){
					return uni.showToast({
						title: '申请仓库不能为空',
						icon:"none"
					})
				}else if(!checkResult){
					return uni.showToast({
						title: error,
						icon:"none"
					})
				}
				let URL =  ajaxUrl;
				console.log(URL)
				this.axios({
					url: URL ,
					data: data ,
					isLoading: 1
				}).then(res=>{
					let { Result } = res ;
					this.$utils.tips('提交成功')
					utils.delayBack();
				})
			}	
		}
	}
</script>

<style scoped>
	.card-wrapper{
		padding: 26upx;
	}
	.line-height-30{
		line-height: 24px!important;
	}
	
	.sub-table-input{
		margin-top: 10upx;
	}
</style>
